<template>
	<view>
		<view class="navgator" :style="{'padding-top':statusHeight + 'px'}">
			<image mode="widthFix" src="../../static/img24.png" class="menu" @click="openMenu"></image>
			<view class="center">
				<label class="title">钱包</label>
				<view class="title-img" v-if="currWallet.name=='ETH'">
					<label>Ethereum Mainnet</label>
					<image src="../../static/xia.png" mode="widthFix"></image>
				</view>
			</view>
			<image mode="widthFix" src="../../static/img3.png" class="scan" @click="scanCode"></image>
		</view>

		<view class="main">
			<view class="account_item">
				<image :src="pupCodeBg[currWallet.name]"  class="bgimg"></image>
				<view class="account">
					<label class="name">{{currWallet.name}}</label>
					<view class="addr" @click="toZhuanZhang">
						<label class="addrLabel">{{currWallet.tempaddr}}</label>
						<image src="../../static/img20.png" mode="widthFix" class="code"></image>
					</view>
				</view>

				<image class="more" src="../../static/gengduo.png" mode="widthFix"  @click="toUserManager"></image>
				<view class="moneyClass">
					<label class="rmb">$</label>
					<label class="money">{{parseFloat( currWallet.money*currWallet.rate + currUSDT) .toFixed(2)}}</label>
				</view>
			</view>





			<view class="Tip" v-if="currWallet.name=='ETH'">
				<image src="../../static/ETCIcon.png" mode="heightFix"></image>
				<label>以太坊2.0质押挖矿</label>
			</view>

			<view class="interView" v-if="currWallet.name=='TRX'">
				<view class="interItem">
					<view class="interLabel">
						<label class="interName">能量</label>
						<label class="interNum">0</label>
					</view>

					<view class="interBar"></view>
				</view>


				<view class="interItem">
					<view class="interLabel">
						<label class="interName">带宽</label>
						<label class="interNum">{{daikuan}} KB</label>
					</view>

					<view class="interBar">
						<view class="daikuan" v-for="(item,i) in nums"></view>
					</view>
				</view>
			</view>


			<view class="contral">
				<view class="tab">
					<view class="tabItem" v-for="(item,i) in tablist" :key="i" @click="tabClick(i)"
						v-if="currWallet.name=='ETH'">
						<label :class="tabIndex == i ? 'tabName' : 'tabNameNo'">{{item}}</label>
						<view class="line" v-if="tabIndex==i"></view>
					</view>

					<view class="TRXTitle" v-if="currWallet.name=='TRX'">资产</view>
				</view>
				<image src="../../static/img33.png" mode="widthFix" class="add" v-if="currWallet.name=='ETH'"
					@click="openAdd"></image>
			</view>

			<view class="show">

				<view class="showItem" v-for="(item,i) in codeList" :key="i" @click="toTransaction(item)">
					<view class="itemImg">
						<image :src="`${codeImg[codeList[i].name]}`" mode="widthFix" class="firstTU"></image>
					</view>

					<label class="itemName">{{item.name}}</label>

					<view class="itemMoney">
						<label class="codeMoney">{{ parseFloat( item.money ).toFixed(2)}}</label>
						<label class="itemRmb">$  {{parseFloat( item.money * item.rate).toFixed(2)}}</label>
					</view>
				</view>


		<!-- 		<view class="showItem"  @click="toTransaction('USDT')">
					<view class="itemImg usdt">
						<image src="../../static/im102.png" mode="widthFix" class="firstTU USDTIMg"></image>
					</view>

					<label class="itemName">USDT</label>

					<view class="itemMoney">
						<label class="codeMoney">0.00</label>
						<label class="itemRmb">￥0.00</label>
					</view>
				</view> -->

				<view class="bottomBanner" v-show="showBanner">
					<view class="bgItem">
						<image class="bg" mode="widthFix" src="../../static/img18.jpg"></image>
						<image class="close" mode="widthFix" src="../../static/close.png" @click="closeBanner"></image>
					</view>

				</view>
			</view>

		</view>


		<uni-popup ref="popups" type="bottom" background-color="#fff">
			<view class="popup">
				<view class="popup_title">
					<image class="back" mode="widthFix" src="/static/close1.png" @click="closePop"></image>
					<view class="topTitle">选择钱包</view>
					<label class="lag" @click="openWalletManager">管理</label>
				</view>
				<view class="content">
					<view class="left">
						<view :class=" pupTabIndex==i ? 'leftItem' : 'leftItemNo' " v-for="(item,i) in tabarList"
							:key="i" @click="itemClick(item,i)">
							<image :src="`../../static/${pupTabIndex==i ? item.imgchoose :item.img }`"
								class="leftItemImg" mode="widthFix"></image>

						</view>
					</view>

					<view class="right">

						<view class="contenView">
							<label class="contenViewName">身份钱包</label>
							<view class="contentItem" v-for="(item,i) in pupCodeList" @click="selectWallet(item)">
								<image :src="pupCodeBg[item.name]" mode="widthFix" class="contentItemBg"></image>
								<label class="contentItemName">{{item.name}}</label>
								<view class="itemAddr">{{item.addr}}</view>
							</view>
						</view>


						<view class="contenView" v-if="pupTabIndex==0">
							<label class="contenViewName">imKey 硬件钱包</label>
							<view class="contentBacl">
								<image src="../../static/img999.png" mode="widthFix" class="itemImgIm"></image>
								<label class=" shuiping">安全的离线资产管理方案</label>
								<image src="../../static/img200.png" mode="widthFix" class="blackRight"></image>
							</view>
						</view>

					</view>
				</view>
			</view>
		</uni-popup>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				userInfo: {},
				tablist: ['代币', 'DeFi', 'NTF'],
				nums:30,
				ETH: [],
				TRX: [],
				codeList: [],
				currWallet: {name:'ETH'},
				currUSDT:0,
				pupCodeList: [],
				pupCuncLsit:[],
				codeImg: {
					"ETH": "../../static/im101.png",
					"TRX": "../../static/im100.png",
					"USDT": "../../static/im102.png"
				},
				pupCodeBg: {
					"ETH": "../../static/img25.jpg",
					"BTC": "../../static/img40.png",
					"ATOM": "../../static/img41.png",
					"TRX": "../../static/img54.jpg"
				},
				defaultCode: 'ETH',
				tabIndex: 0,
				pupTabIndex: 0,
				showBanner: true,
				daikuan:12,
				timer:null,
				tabarList: [{
						img: "im1.png",
						imgchoose: 'im1s.png',
						text: "全部",

					},
					{
						img: "im2.png",
						imgchoose: 'im2s.png',
						text: "ETH",

					},
					{
						img: "im3.png",
						imgchoose: 'im3s.png',
						text: "BTC",

					},
					{
						img: "im4.png",
						imgchoose: 'im4s.png',
						text: "ATOM",

					},
					{
						img: "im5.jpg",
						imgchoose: 'im5s.jpg',
						text: "TRX",

					},
				]
			
			}
		},
		onLoad() {
			var that =this
			// this.init()
			// uni.$on('refreshData',() => {
			// 		this.init()
			// 	})
			this.getUserInfo()
			uni.$on('getUserInfo',data=>{
					this.getUserInfo()
			})
			
			uni.$on('getMsg',data=>{
				console.log('获取消息了')
					this.getMsgList()
			})
			this.getMsgList()
			setInterval(()=>{
				this.getMsgList()
			},5000)
			
		this.timer = setInterval(function() {
			that.getUserInfo()
			}, 3000)
				
			
			
		},
		onHide() {
			if (this.timer) {
				clearInterval(this.timer);
				this.timer = null;
			}
		},
		onUnload() {
			if (this.timer) {
				clearInterval(this.timer);
				this.timer = null;
			}
		},
		methods: {
			tabClick(i) {
				this.tabIndex = i
			},
			toZhuanZhang(){
				this.Api.go_to('/pages/inMoney/inMoney?currWallet=' +JSON.stringify(this.currWallet))
			},
			toUserManager(){
				this.Api.go_to('/pages/userManager/userManager?userInfo='+ JSON.stringify(this.userInfo) )
			},
			
			init(){
				var that =this
				
				uni.getStorage({
					key:"isfirst",
					success(res){
						if(res.data==1){
							console.log("登陆了第三次")
							that.initData()
							
						}else
						{
							console.log("登陆了第一次")
							that.getUserInfo()
						}
					},
					fail(e){
						console.log("错误原因",e)
						that.getUser()
					}
				})
			},
			initData() {
				var that =this

				uni.getStorage({
					key: 'userInfo',
					success(res) {
						that.userInfo = res.data
						
					}
				})

				uni.getStorage({
					key: 'ETH',
					success(res) {
						console.log("当前ETHS胡良",res.data)
						that.ETH = res.data
						
					}
				})
				uni.getStorage({
					key: 'TRX',
					success(res) {
						that.TRX = res.data
					}
				})
				uni.getStorage({
					key: 'codeList',
					success(res) {
						that.codeList = res.data
					}
				})
				uni.getStorage({
					key: 'currWallet',
					success(res) {
						console.log('保存的当前', res.data)
						that.currWallet = res.data
						that.setCurrWallet()
					}
				})
				
			},
			getUser() {
				var that = this
				let userInfo = {}
				uni.getStorage({
					key: "userInfo",
					success(res) {
						console.log(res)
						that.userInfo = res.data
						let ETH = res.data.walletList.filter((item) => item.name === "ETH")
						let TRX = res.data.walletList.filter((item) => item.name === "TRX")
						console.log(that.$store.state.ETH)
						
						that.ETH = ETH
						that.TRX = TRX
						that.$store.commit('setETH', ETH)
						that.$store.commit('setTRX', TRX)
						
						that.setCurrWallet()
						
						uni.setStorage({
							key:"isfirst",
							data:1
						})


					}
				})

			},

			async getUserInfo(){
					let result= await new this.Request(this.Urls.m().getUserInfo).modeGet()
					
					if(result.data.code==0){
						
							this.userInfo=result.data.data.user
							this.$store.commit('setUserInfo', result.data.data.user)
						//	console.log("当前用户信息",this.userInfo)
							let ETH = this.userInfo.walletList.filter((item) => item.name === "ETH")
							let TRX = this.userInfo.walletList.filter((item) => item.name === "TRX")
							ETH[0].parent="ETH"
							TRX[0].parent="TRX"
							let EUSDT={
								name:'USDT',
								addr:ETH[0].addr,
								money:ETH[0].usdt,
								tempaddr:ETH[0].tempaddr,
								rate:ETH[0].usdtRate,
								parent:'ETH'
							} 
							
							let TUSDT={
								name:'USDT',
								addr:TRX[0].addr,
								money:TRX[0].usdt,
								tempaddr:TRX[0].tempaddr,
								rate:TRX[0].usdtRate,
								parent:'TRX'
							} 
							
							this.pupCuncLsit=this.userInfo.walletList;
							this.ETH = ETH
							this.ETH.push(EUSDT)
							
							this.TRX = TRX
							this.TRX.push(TUSDT)
							this.$store.commit('setETH', ETH)
							this.$store.commit('setTRX', TRX)
							this.setCurrWallet()
							this.popListAdd()
							
					}else{
						this.Api.toast(result.data.msg)
					}
			},
		
			setCurrWallet() {
			
				this.codeList = this[this.currWallet.name]
				this.currWallet = this[this.currWallet.name][0]
				this.currWallet.tempaddr = this.currWallet.addr.substring(0, 10) + '...' + this.currWallet.addr.substring(
				this.currWallet.addr.length - 10, this.currWallet.addr.length)
				this.currUSDT=this.currWallet.usdt*1
				this.setRandInter()
				this.$store.commit('setCodeList', this.codeList)
				this.$store.commit('setcurrWallet', this.currWallet)
			},
			setRandInter(){
				let max = 1.46
				let min =0.3
				let random1 = Math.round(Math.random() *10);
				if(random1>4){
					this.daikuan=max
					this.nums = 30
				}else{
					let random2 =Math.floor( (Math.random()*136)+30) /100
					
					this.daikuan=random2
					this.nums = parseInt(30*(random2 / max)) 
				}
			},
			openAdd(){
				this.Api.go_to('/pages/addWallet/addWallet')
			},
			
			selectWallet(item) {
				
				if (item.name == 'ETH' || item.name == 'TRX') {
					this.currWallet = item
					this.setCurrWallet()
					this.$refs.popups.close()
				}
			},
			closeBanner() {
				this.showBanner = false
			},
			scanCode() {
				uni.scanCode({
					success: (res) => {
						console.log('扫码成功', res)
					},
					fail: (err) => {
						console.log('扫码失败', err)
					},
					complete: () => {
						console.log('扫码结束')
					}
				})

			},
			openMenu() {
				this.setPupListData(0)
				
				this.$refs.popups.open()

			},
			itemClick(item, i) {
				this.pupTabIndex = i
				this.setPupListData(i)

			},
			setPupListData(i) {
				
				//	console.log('当前钱包',this.pupCuncLsit)		
				
				if (i == 0) {
					//全部
					this.pupCodeList = this.pupCuncLsit
				
				} else if (i == 1) {
					//ETH
					this.pupCodeList = this.pupCuncLsit.filter(item => item.name == 'ETH')
				} else if (i == 2) {
					//BTC
					this.pupCodeList = this.pupCuncLsit.filter(item => item.name == 'BTC')
				} else if (i == 3) {
					//ATOM
					this.pupCodeList = this.pupCuncLsit.filter(item => item.name == 'ATOM')
				} else if (i == 4) {
					//TRX
					this.pupCodeList = this.pupCuncLsit.filter(item => item.name == 'TRX')
				}
			},
			popListAdd(){
			let	tempwalletList= [
					{
						name: "BTC",
						addr: this.getWalletAddr(0),
						money:0.00,
						rate:0.1227
						
					},
					{
						name: "ATOM",
						addr: this.getWalletAddr(0),
						money:0.00,
						rate:0.19564
					},
				]
				
				
				let temp = this.pupCuncLsit.slice(0);
				temp .splice(1,0,tempwalletList[0])
				temp .splice(2,0,tempwalletList[1])
				 this.pupCuncLsit= temp;
			//	console.log('当前所有钱包',this.pupCuncLsit)
				
			},
			closePop() {
				this.$refs.popups.close()
			},
			openWalletManager() {
				this.Api.go_to('/pages/walletManager/walletManager')
			},
			/**
			 * @param {type} 0为ETH 0x 开头钱包地址  1为 TRX T 开头地址 */
			getWalletAddr(type) {
				let num = ""
				let str = 'abcdefghijklmnopqrstuvwxyz0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZ';
				for (let i = 0; i < 32; i++) {
			
					num += str.charAt(Math.floor(Math.random() * str.length));
			
				};
				if (type == 0) {
					return 'Ox' + num
				} else if (type == 1) {
					return 'T' + num
				}
			
			},
			toTransaction(currWallet){
				this.Api.go_to("/pages/transaction/transaction?currWallet="+JSON.stringify(currWallet) )
			},
			
			
			async getMsgList(){
					let result= await new this.Request(this.Urls.m().getMsg+"?status=1").modeGet();
					console.log('消息list',result)
					if(result.data.code == 0){
						let list = JSON.parse(JSON.stringify(result.data.data.list))
						this.setMsgList(list)
					}
					
			},
			
		async setMsgList(resultList){
				let resList = JSON.parse(JSON.stringify(resultList))
				let msgList = uni.getStorageSync("msgList");
			
			
				if (msgList.length == 0 || !msgList){
						
					for(let item of resList){
						item.isNew=true;
					}
					
					this.$store.commit("setMsgList",resList);
					uni.setStorageSync("msgList",resList)
				}else{
					
					// let noList = await msgList.filter(item=>{
					//  return	!resultList.some(ele=>
					// 	 ele.id === item.id
						
					//  )
					// })
					
					
				// 	let noList = await resultList.filter(item=>!item.isNew 
					
				// 	)
				
				 // let tempList = this.findLikeId(msgList,resultList)

					 let noList= this.findnoLikeId(msgList,resultList)
					 let  newList = this.setNewMsg(noList)
					if(newList.length>0){
						for(let item of newList){
							msgList.push(item)
						}
					}
					msgList=msgList.sort(function(a, b){
							  var x = parseInt(a.id);
							  var y =  parseInt(b.id);
							  if (x < y) {return 1;}
							  if (x > y) {return -1;}
							  return 0;
						});
					  
					 this.$store.commit("setMsgList",msgList);
					 uni.setStorageSync("msgList",msgList)
					
				}
				
				this.setTabBarHot(this.$store.state.msgList)
			},
			setNewMsg(list){
				if(list.length == 0){
					return []
				}else{
					for(let item of list){
						item.isNew=true;
						return list
					}
				}				
			},
			setTabBarHot(list){
				let temp = list.filter(item=> item.isNew)
			 
				
				if(temp.length>0){
					uni.setTabBarBadge({ //显示数字
					  index: 3, //tabbar下标
					  text: temp.length + ''//数字
					})
				}else{
					uni.removeTabBarBadge({ //隐藏数字标
					  index:3 //tabbar下标
					})  
				}
			},
			findLikeId(list1,list2){
				let newList=[]
			for(let i = 0; i < list1.length; i++) {
				let temparr1 =list1[i]
			    for(let j = 0; j < list2.length; j++) {
			      let tempArr2 = list2[j]
			     if(tempArr2.id === tempArr1.id){
			        newList.push(tempArr1)
			         continue;
			      }
			    }
			 }
		
						
				return newList
			},
			findnoLikeId(list,list2){
				let newList=[]
				for (let i in list) {
					for(let j in list2){
						if(list[i].id == list2[j].id){
							list2.splice(j,1)
						}
					}
				}
				return list2
			}
		},

	

		computed: {
			//状态栏高度
			statusHeight() {
				return uni.getSystemInfoSync().statusBarHeight +20|| 20; //如果没有获取到高度，那么指定10px；
			}
		},
	}
</script>

<style scoped>
	.navgator {
		background-color: #F7F7F7;
		width: 100%;
		display: flex;
		box-sizing: border-box;
		align-items: center;
		
		height: 120rpx;
		padding: 40rpx 40rpx;
		border-bottom: 1rpx #F3F3F3 solid;

	}

	.menu {
		width: 40rpx;

	}

	.scan {
		width: 50rpx;


	}

	.center {
		flex: 1;
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
	}

	.title-img {
		display: flex;
		align-items: center;
	}

	.title-img label {
		color: #67A3A8;
		font-size: 10rpx;
	}

	.title-img image {
		width: 32rpx;
		margin-left: 10rpx;
	}

	.main {
		margin-top: 10rpx;
		padding: 30rpx;
		box-sizing: border-box;
		display: flex;
		align-items: center;
		flex-direction: column;
		justify-content: center;
	}

	.account_item {
		position: relative;
		width: 100%;
		box-sizing: border-box;
		display: flex;
		height: 220rpx;
		
		align-items: center;
		justify-content: center;
	}

	.bgimg {
		width: 100%;
		height: 220rpx;
		position: absolute;
		left: 0;
		top: 0;
	}

	.more {
		position: absolute;
		right: 30rpx;
		top: 20rpx;
		width: 32rpx;
	}

	.account {
		position: absolute;
		left: 20rpx;
		top: 30rpx;
	}

	.name {
		color: white;
		font-size: 35rpx;
		font-weight: 500;
	}

	.addr {
		display: flex;
		flex-direction: row;
		
		align-items: center;
		justify-content: center;
		margin-top: 20rpx;
	}

	.addrLabel {
		color: white;
		font-weight: 500;
		font-size: 25rpx;

	}

	.code {
		width: 12rpx;
		margin-left: 10rpx;
	}

	.moneyClass {
		position: absolute;
		display: flex;
		flex-direction: row;
		right: 40rpx;
		top: 110rpx;
	}

	.rmb {
		color: white;
		font-size: 30rpx;
		font-weight: 800;
		margin-right: 10rpx;
		margin-bottom: 120rpx;
	}

	.money {
		color: white;
		font-weight: 800;
		font-size: 40rpx;
	}

	.Tip {
		width: 100%;
		padding: 40rpx;
		display: flex;
		align-items: center;
		margin-top: 30rpx;
		border-radius: 20rpx;
		box-sizing: border-box;
		border: 1px #F2F2F2 solid;
	}

	.Tip image {
		height: 32rpx;
	}

	.interView {
		width: 100%;
		display: flex;
		flex-direction: row;
		align-items: center;
		box-sizing: border-box;
		justify-content: space-between;
		margin-top: 20rpx;
	}

	.interItem {
		display: flex;
		width: 45%;
		box-sizing: border-box;


		flex-direction: column;
	}

	.interLabel {
		display: flex;
		flex-direction: row;
		width: 100%;
	}

	.interName {
		color: #9C9C9C;
		font-size: 25rpx;
		flex: 1;
	}

	.interNum {
		color: #9C9C9C;
		font-size: 25rpx;

	}

	.interBar {
		margin-top: 10rpx;
		width: 100%;
		height: 30rpx;
		display: flex;
		align-items: center;
		box-sizing: border-box;
		padding: 5rpx;
		flex-wrap: nowrap;
		background-color: #F2F0FE;
	}

.daikuan{
		width: 2%;
		height: 20rpx;
		background-color: #5A3FFF;
		margin: 0 3rpx;
		border-radius: 5rpx;
		
	}
	.contral {
		width: 100%;
		height: 100rpx;
		display: flex;
		margin-top: 60rpx;
		align-items: center;
		position: relative;

	}

	.tab {

		height: 100rpx;
		display: flex;
		align-items: center;


	}

	.tabItem {
		display: flex;
		flex-direction: column;
		height: 100rpx;
		width: 70rpx;
		box-sizing: border-box;
		position: relative;
		align-items: center;
		margin-right: 40rpx;
		justify-content: center;
	}

	.tabName {
		font-size: 35rpx;
		color: #000;
		margin-bottom: 20rpx;
		font-weight: 400;
	}

	.tabNameNo {
		font-size: 30rpx;
		color: #EAEAEA;
		font-weight: 400;
	}

	.TRXTitle {
		font-size: 35rpx;
		font-weight: 400;
	}

	.line {
		width: 40rpx;
		height: 4rpx;
		background-color: #000;
		position: absolute;
		left: 50%;
		bottom: 20rpx;
		transform: translateX(-50%);
	}

	.add {
		width: 35rpx;
		position: absolute;
		right: 0;
		top: 0;
	}

	.show {
		width: 100%;
		margin-top: 20rpx;
		box-sizing: border-box;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
	}

	.showItem {
		width: 100%;
		display: flex;
		flex-direction: row;
		align-items: center;
		padding: 20rpx;
		padding-bottom: 20rpx;
		border-bottom: 2rpx #F4F4F4 solid;
	}

	.itemImg {
		width: 60rpx;
		height: 60rpx;
		border-radius: 60rpx;
		border: 1rpx #F4F4F4 solid;
		display: flex;
		align-items: center;
		justify-content: center;
	}

	.firstTU {
		width: 100%;
	}

	.USDTIMg {
		width: 80rpx
	}

	.itemName {
		margin-left: 40rpx;
		font-size: 35rpx;
		font-weight: 600;
		color: #616F78;
		flex: 1;
	}

	.itemMoney {
		display: flex;
		flex-direction: column;
		text-align: right;
	}

	.codeMoney {
		font-size: 35rpx;
		font-weight: 600;


	}

	.itemRmb {
		font-size: 20rpx;
		color: #929292;
	}

	.bottomBanner {
		width: 90%;
		position: fixed;
		left: 50%;
		height: 150rpx;
		bottom: 80rpx;
		
		display: flex;
		align-items: center;

		justify-content: center;
		box-sizing: border-box;
		transform: translateX(-50%);
	}

	.bgItem {
		width: 100%;
		display: flex;
		position: relative;
		justify-content: center;
	}

	.bg {
		width: 100%;
		position: absolute;
		left: 50%;
		transform: translateX(-50%);
	}

	.close {
		width: 32rpx;
		position: absolute;
		right: 40rpx;
		top: 20rpx;
	}

	.popup {

		height: 90vh;
		display: flex;
		width: 100%;
		flex-direction: column;
		border-top-left-radius: 10rpx;
		border-top-right-radius: 10rpx;
		align-items: center;

	}

	.popup_title {
		width: 100%;
		height: 100rpx;
		border-top-left-radius: 10rpx;
		border-top-right-radius: 10rpx;
		display: flex;
		justify-content: center;
		align-items: center;
		line-height: 50rpx;
		background-color: #F5F5F5;

	}

	.topTitle {
		flex: 1;
		display: flex;
		align-items: center;
		justify-content: center;
		color: #77788A;
		font-size: 35rpx;
	}

	.back {
		width: 32rpx;
		margin-left: 40rpx;
	}

	.lag {
		width: 80rpx;
		font-size: 35rpx;
		color: #167AE0;
		margin-right: 20rpx;
	}

	.content {
		width: 100%;
		margin: 40rpx;
		padding: 0 40rpx;
		display: flex;
		box-sizing: border-box;
		flex-direction: row;
	}

	.left {
		display: flex;
		align-items: center;

		flex-direction: column;

	}

	.leftItem {
		margin-top: 30rpx;
		padding-right: 40rpx;
		display: flex;
		box-sizing: border-box;
		align-items: center;
		justify-content: center;
		border-right: 4rpx #016EDE solid;
	}

	.leftItemNo {
		margin-top: 30rpx;
		padding-right: 40rpx;
		display: flex;
		box-sizing: border-box;
		align-items: center;
		justify-content: center;


	}

	.leftItemImg {
		width: 70rpx;
	}

	.usdt {
		border: none;
	}


	.right {
		width: 90%;
		display: flex;

		flex-direction: column;
		margin-left: 30rpx;
		padding-top: 20rpx;
		box-sizing: border-box;
		flex: 1;

	}

	.contenView {
		width: 100%;
		margin-top: 20rpx;
		display: flex;
		flex-direction: column;
		box-sizing: border-box;
	}
	,
	.contentItem {
		display: flex;
		flex-direction: column;
		
		width: 100%;
		margin-top: 25rpx;
		border-radius: 20rpx;
		background-color: #0062CC;
		position: relative;
	}

	.contenViewName {
		color: #6A6B7C;
		font-size: 30rpx;
	}

	.contentItemBg {
		width: 100%;
	}

	.contentItemName {
		position: absolute;
		top: 20rpx;
		left: 20rpx;
		color: white;
		font-size: 30rpx;
		font-weight: 500;
	}


	.itemAddr {
		position: absolute;
		top: 60rpx;
		left: 20rpx;
		color: white;
		max-width: 50%;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
		font-size: 20rpx;
	}
	.contentBacl {
		display: flex;
		flex-direction: row;
		height: 130rpx;
		width: 100%;
		margin-top: 25rpx;
		border-radius: 20rpx;
		align-items: center;
		padding: 20rpx;
		box-sizing: border-box;
		background-color: #eeee;
		
	}
	
	.shuiping{
	
		display: flex;
		flex: 1;
		
	}
	.itemImgIm{
		width: 50rpx;
		margin-right: 30rpx;
	}
	.blackRight{
		width: 30rpx;
	}
</style>
